<template>
    <div>
        <van-cell :title="songname" :label="fullname">
            <template #right-icon>
                <van-icon name="play-circle-o" size='0.6rem' class="search-icon" @click="goto" />
            </template>
        </van-cell>
    </div>
</template>

<script>
    export default {
        props: {
            songname: {
                type: String,
                required: true
            },
            singename: {
                type: String,
                required: true
            },
            songId: {
                type: Number,
                require: true
            }
        },
        computed: {
            fullname() {
                return this.singename + ' - ' + this.songname
            }
        },
        methods: {
            goto() {
                this.$router.push({
                    path: '/play',
                    query: {
                        id: this.songId
                    }
                })
            }
        }
    }
</script>

<style>

</style>